<template>
  <!-- 运单 -->
  <a-grid-item :span="{lg: 2}" class="g-collapse">
    <a-collapse :default-active-key="['1']">
      <a-collapse-item header="运单" key="1">
        <template #extra>
          <a-button-group>
            <a-button @click.stop="openList(0)">
              <icon-eye/>
              大货
            </a-button>
            <!-- <a-button @click.stop="openList(1)" type="primary" status="danger">
              <icon-eye/>
              存疑
            </a-button> -->
          </a-button-group>
        </template>
        <div class="grid justify-center">
          <item title="运单数量" :number="record.volume_weight?.shipment_count"/>
        </div>
      </a-collapse-item>
    </a-collapse>
  </a-grid-item>
  <!-- 货箱 -->
  <a-grid-item :span="{lg: 4}" class="g-collapse">
    <a-collapse :default-active-key="['1']">
      <a-collapse-item header="货箱" key="1">
        <template #extra>
          <a-button-group>
            <a-button @click.stop="visible.addParcels = true" v-auth="['document:waybill:addParcel']">
              <icon-folder-add/>
              添加货箱
            </a-button>
            <a-button @click.stop="visible.viewParcels = true">
              <icon-eye/>
              查看货箱
            </a-button>
          </a-button-group>
        </template>
        <div class="flex justify-around">
          <item title="货箱数量" :number="record.volume_weight?.parcel_count" />
          <item title="实重(kg)" :number="record.volume_weight?.weight" />
          <item title="材积重(kg)" :number="record.volume_weight?.volume_weight" />
          <item title="总体积(m³)" :number="record.volume_weight?.volume" />
        </div>
      </a-collapse-item>
    </a-collapse>
  </a-grid-item>

  <shipmentList v-model="visible.shipment"/>
  <addParcelsToDelivery v-model="visible.addParcels"/>
  <parcelsList v-model="visible.viewParcels"/>
</template>
<script setup>
import {computed, inject, ref,provide} from "vue";
import Item from "@/views/document/waybill/components/item.vue";
import ShipmentList from "@/views/warehouse/delivery/components/ShipmentList.vue";
import parcelsList from "@/views/warehouse/delivery/components/parcelsList.vue";
import AddParcelsToDelivery from "@/views/warehouse/delivery/components/AddParcelsToDelivery.vue";

const record = inject('record')
const visible = ref({
  shipment: false,
  addParcels: false,
  viewParcels: false,
})
const openList= (type)=>{
  visible.value.shipment = true
  // record.value.problem = type
}
</script>